import React  from 'react';
import PropTypes from 'proptypes';
export default function Message(props){
  const [state,setState]=React.useState({});
  React.useEffect(()=>{
    setState({ visible: true });
    return ()=>{
      setState({ visible: false });
    }
  },[]);
  const onClose=()=> {
    setState({ visible: false });
  }

    const { closeable, title, message, type, preformatted } = props;
    var classtype = `ui message ${type || ''}`;
    return (
      <div visible={'' + state.visible} animation="fade" duration={500}>
        <div className={classtype}>
          {closeable && (
            <i className="close icon" onClick={onClose} />
          )}
          {title && <div className="header">{title}</div>}
          {message && preformatted ? <pre>{message}</pre> : <p>{message}</p>}
        </div>
      </div>
    );
}
